<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css_颜色样式表示方法</title>
    <style>
        /*第一种直接指定样式为配置的颜色*/
        #beijing{
            color: turquoise;
        }
        /*采用rgb方式来进行添加颜色，
        第一个参数（0）：红色（Red）的强度值，范围是 0 到 255。
        第二个参数（0）：绿色（Green）的强度值，范围同样是 0 到 255。
        第三个参数（255）：蓝色（Blue）的强度值，范围也是 0 到 255。
        rgba和rgb用法一样，只是多个一个透明度参数，透明度参数的范围是0到1，0为完全透明，1为完全不透明。
        */
        .shanghai{
            color: rgb(0,0,255,0);
        }

        /*
        HELA:是 CSS 中使用 十六进制（Hex）表示颜色 的一种简写方式，它对应的是 RGB 颜色模型。
            每个颜色通道用两位十六进制数表示：0123456789ABCDEF 每一组 开始是00 结尾是ff  不区分大小写
                第一组 00：红色（Red）  00~ff
                第二组 ff：绿色（Green）  00~ff
                第三组 00：蓝色（Blue）  00~ff
       (可以只写前三种) 第四组：透明度  00~ff
            下面这个写法：#0f00 是 简写形式，完整写法是 #00ff0000。
                只有当每对字符重复时才可以简写，例如 #00ff00 可以写成 #0f0，但 #00f0f1 就不能简写。
        */
        ul[title="wuhan"]{
            color: #00ff0000;
        }


        /*
        hsl(0, 100%, 50%) 是 CSS 中另一种表示颜色的方式，
        第一个参数（0）：色相（Hue），表示颜色的种类，取值范围为 0 到 360 或 0deg 到 360deg。
            0 或 0deg 表示红色。其他值对应不同的颜色（如 120 是绿色，240 是蓝色）。
        第二个参数（100%）：饱和度（Saturation），表示颜色的纯度。
            100% 表示完全饱和，没有灰色成分。
            0% 表示完全去饱和，变成灰色。
        第三个参数（50%）：亮度（Lightness），表示颜色的明暗程度。
            0% 表示黑色。
            50% 表示正常亮度。
            100% 表示白色。
        hsla() 的透明度参数的范围是0到1，0为完全透明，1为完全不透明。
        */
        ul>li>ul{
            color: hsla(0,100%,50%,0.5);
        }
    </style>
</head>
<body>
    <ul>
        <li>方法一
            <ul id = "beijing">
                北京
            </ul>
        </li>

        <li>方法二
            <ul class="shanghai">
                上海
            </ul>
        </li>

        <li>方法三
            <ul title="wuhan">
                武汉
            </ul>
        </li>
        <li>方法四
            <ul>
                成都
            </ul>
        </li>
    </ul>

</body>
</html>